/* 定义主题变量 */



/* 暗黑主题 */
.dark-theme {
  --bg-color: rgb(172, 192, 222);
  --text-color: #d1d5db;

  --nav-bg-color: #3f3f3f;
  --nav-text-color: #f9f9f9;
  --link-hover-color: #66d3fa;

  --canvas-bg-color: #3f3f3f;
  --blog-carousel-caption-color: #9caec7;
  --blog-carousel-control-color: #9caec7;
  --button-bg: #5fb878;
  --button-text: #ffffff;

  --article-order-bg-color: #3f3f3f;
  --article-order-title-color: #574c64;
  --article-order-active-bg-color: #3f3f3f;
  --article-order-active-color: #3f3f3f;
  --article-bg-color: #3f3f3f;
  --article-title-color: #9caec7;
  --article-text-color: #9caec7;
  --article-info-color: #999;
  --article-border-color: #3f3f3f;
  --article-avatar-bg-color: #d6e5f0;
  --article-hover-bg-color: #4e4949e6;
  --article-detail-bg-color: #3f3f3f;
  --article-detail-title-color: #d4cae0;
  --article-detail-text-color: #9caec7;
  --article-detail-border-color: #3f3f3f;
  --article-detail-info-border-color:#f5f5f5;
  --article-button-bg-color: #5fb878;
  --article-button-text-color: #fff;
  --article-comment-border-color: #9caec7;
  --article-comment-editor-color: #9caec7;
  --article-comment-submit-color: #5fb878;
  --article-comment-submit-text-color: #fff;

  --card-bg-color: #3f3f3f;
  --card-title-color: #9caec7;
  --card-content-color: #9caec7;
  --card-hover-color: #555;
  --card-border-color: #9caec7;
  --card-text-color: #f9f9f9;
  --card-link-bg-color: #4e4949e6;
  --card-link-text-color: #9caec7;
  --card-link-color: #5fb878;
  --card-link-hover-color: #9caec7;

  --search-bg-color: #3f3f3f;
  --search-text-color: #f9f9f9;
  --search-title-color: #9caec7;
  --search-keyword-color: #fff;
  --search-keyword-b-color: #9caec7;
  --search-border-color: #5fb878;

  --page-bg-color: #3f3f3f;
  --page-bg-hover-color: #a6f7ff;
  --page-title-color: #fff;
  --page-hover-color: #9caec7;
  --page-hover-text-color: #fff;
  --page-text-color: #9caec7;
  --page-primary-color: #5fb878;
  --page-disabled-color: #e6e6e6;
  --page-spr-color: #e6e6e6;
  --page-active-hover-bg-color: #5fb878;
  --page-active-hover-color: #fff;
  --page-active-bg-color: #5fb878;
  --page-active-text-color: #fff;
  --page-active-border-color: #5fb878;
  --page-disabled-bg-color: #3f3f3f;
  --page-disabled-text-color: #ddd;
  --page-disabled-border-color: #5fb878;

  --sentence-date-color: #5fb878;
  --about-bg-color: #3f3f3f;
  --about-title-color: #9caec7;
  --about-title-hover-color: #5fb878;
  --about-text-color: #ffffff;
  --about-border-color: #5fb878;
  --about-textarea-bg-color: rgba(213, 238, 241, 0.93);
  --about-shadow-color: #5fb878;
  --about-button-bg-color: #5fb878;
  --about-button-text-color: #fff;

  --profile-bg-color: #3f3f3f;
  --profile-title-color: #fff;
  --profile-text-color: #fff;
  --profile-label-color: #fff;
  --profile-link-color: #5fb878;
  --profile-link-hover-color: #a6f7ff;
  --profile-meta-color: #d1d5db;
  --profile-input-bg-color: #f5f5f5;
  --profile-input-focus-color: #5fb878;
  --profile-btn-color: #fff;
  --profile-btn-hover-color: #a6f7ff;
  --profile-btn-text: #5fb878;
  --profile-btn-message-color: #5fb878;
  --profile-btn-message-hover-color: #75e178;
  --profile-placeholder-color: #9caec7;
  --profile-btn-text-color: #fff;
  --profile-btn-text-hover-color:#fff;
  --profile-btn-bg-color:linear-gradient(90deg, #75e178, #5fb878) ;
  --profile-btn-hover-bg-color: linear-gradient(90deg, #5fb878, #75e178);

  --resources-bg-color: #3f3f3f;
  --resources-title-color: #007bff;
  --resources-text-color: #fff;
  --resources-desc-color: #fff;
  --resources-meta-color: #d1d5db;
  --resources-link-color: #fff;
  --resources-link-hover-color: #5fb878;
  --resources-link-hover-text-color: #fff;
  --resources-border-color: #007bff;
  --resources-shadow-text-color: #3f3f3f;
  --resources-shadow-color: #fff;
  --resources-active-color: #9caec7;
  --resources-active-hover-color: #5fb878;
  --resources-active-hover-text-color: #5fb878;
  --resources-active-text-color: #fff;
  --resources-button-bg-color: #5fb878;
  --resources-button-hover-color: #75e178;
  --resources-button-download-bg-color: #9caec7;
  --resources-button-download-color: #fff;
  --resources-button-hover-bg-color: #75e178;
  --resources-button-text-color: #fff;
  --resources-search-bg-color: #3f3f3f;
  --resources-search-text-color: #fff;
  --resources-search-border-color: #5fb878;
  --resources-card-title-color: #fff;
}

/* 定义全局样式 */
/*页面布局样式 */
.page-container {
      width: 100%;
      margin: 0 auto;
      flex-direction: row;
    }

.page-content {
width: 80%;
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  justify-content: center;
  align-items: flex-start;
}
.content-left {
  flex: 0 0 70%; /* 2/3宽度比例 */
  min-width: 0; /* 防止内容溢出 */
}
.content-right {
  flex: 0 0 28%; /* 1/3宽度比例 */
  max-width: 320px; /* 限制最大宽度 */
  margin-left: 20px;
  margin-top: 15px;
}
pre {
  background-color: #f4f4f4;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 5px;
  font-family: 'Courier New', Courier, monospace;
  overflow-x: auto;
}
code {
  color: #333;
}
.clear {
clear: both;
}
@media (max-width: 992px) {
  .page-content {
    width: 100%;
  }
  .page-header {
    width: calc(100vw - 10%);
  }
 .content-left {
    flex: 0 0 60%; /* 100%宽度比例 */
    min-width: 0; /* 防止内容溢出 */
 }
 .content-right {
    flex: 0 0 30%; /* 100%宽度比例 */
    max-width: 80%; /* 限制最大宽度 */
    margin-top: 15px;
  }

}
@media (max-width: 768px) {
  .page-content {
    width: 768px;
    margin: 0 auto;
    flex-direction: column;
    align-items: center;
  }
  .content-left {
    width: calc(100vw - 10%); /* 100%宽度比例 */
    min-width: 0; /* 防止内容溢出 */
  }
  .content-right {
    width: calc(100vw - 10%);
    max-width: 100%; /* 限制最大宽度 */
    margin-left:0;
    margin-top: 15px;
  }
}
@media (max-width: 576px) {
  .page-content {
    width: 100%;
    margin: 0 auto;
  }
}
@media (max-width: 480px) {
  .page-content {
    width: 100%;
    margin: 0 auto;
  }
}

/*卡片组件标题下的横线 */
.underline {
  width: 50px;
  height: 2px;
  margin-bottom: 15px;
  border-bottom: 2px solid var(--card-border-color, #007bff);
}

